/**
 * 
 */

function onRemindItemMouseOver(id) {
	$("#" + id).css("background-color", "white");
}

function onRemindItemMouseOut(id) {
	$("#" + id).css("background-color", "#FFC896");
}

function onItemMouseOver(id) {
	$("#" + id).css("background-color", "yellow");
}

function onItemMouseOut(id) {
	$("#" + id).css("background-color", "white");
}

function onRemindRemoveAction(id) {
	// alert(id);
	var remindid = $("#" + id).attr("remind-id");
	$.ajax({
		type : "POST",
		url : "servlet/SetReply",
		data : "type=delete&remindid=" + remindid,
		success : function(msg) {
			if (msg == "delete success") {
				jNotify("delete success.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
			}
		}
	});
	$("#" + id).fadeOut();
	return false;
}

function onRemindReplyAction(id) {
	var popID = "popup_reply"; // Get Popup Name
	var popURL = "#?w=500"; // Get Popup
	var query = popURL.split('?');
	var dim = query[1].split('&');
	var popWidth = dim[0].split('=')[1]; // Gets the first query string value

	// Fade in the Popup and add close
	// button
	$('#' + popID)
			.fadeIn()
			.css({
				'width' : Number(popWidth) - 50
			})
			.prepend(
					'<a href="#" class="close"><img src="res/pic/home/close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>');

	// Define margin for center
	// alignment (vertical horizontal) -
	// we add 80px to the height/width
	// to accomodate for the padding and
	// border width defined in the css
	var popMargTop = ($('#' + popID).height() + 80) / 2;
	var popMargLeft = ($('#' + popID).width() + 80) / 2;

	// Apply Margin to Popup
	$('#' + popID).css({
		'margin-top' : -popMargTop,
		'margin-left' : -popMargLeft
	});

	$(".twitter-anywhere-tweet-box-editor")
			.val(
					"@"
							+ $("#" + id + " .message-name .message-nickname")
									.text() + " ");
	currentRemindId = $("#" + id).attr("remind-id");
	$("#reply-button").attr("remind-item-id", id);

	return false;
}

function newGroupSubmit(id) {
	var name = $("#popup_new_group #new_group_title").val();
	var id = userID;
	var intro = $("#popup_new_group #new_group_intro").val();
	var openess = $("#popup_new_group #new_group_openess").val();
	if (openess == "公开")
		openess = "true";
	else
		openess = "false";
	$
			.ajax({
				type : "POST",
				url : "servlet/NewGroup",
				data : "id=" + id + "&name=" + name + "&intro=" + intro
						+ "&openess=" + openess,
				success : function(msg) {
					if (msg != "error") {
						jNotify("success.", {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});

						var group = eval("(" + msg + ")");
						var html = "<div class='group-item' id='group-item-"
								+ group.id
								+ "' onmouseover='onItemMouseOver(id)' onmouseout='onItemMouseOut(id)' onclick='onGroupItemClick(id)' > <div class='more'></div> <div class='message'> <div class='group-info'> <div class='group-name'>"
								+ name
								+ "</div> <div class='group-info-content'> <div class='group-info-row'> <a class='group-owner'>"
								+ group.userNickname
								+ "</a> </div> <div class='group-info-row'> <div class='tweet-timestamp' title='"
								+ group.time
								+ "'> <span class='_old-timestamp'>"
								+ group.time
								+ "</span> </div> </div> <div class='group-info-row'> <div class='group-intro'>"
								+ intro
								+ "</div> </div> </div> </div> <div class='function-button-bar'> <a href='javascript:void(false)' class='css3button' onclick='onClickUnfollowGroup("
								+ group.id
								+ ")'><span class='check icon'></span>Unfollow</a> <a href='javascript:void(false)' class='css3button'><span class='rss icon'></span>Subscribe to RSS Feed</a></div> </div> </div>";

						$("#group-item-more").before(html);

					} else {
						jError("error.", {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});
					}
				}
			});
	$("#popup_new_group").fadeOut();
	return false;
}

function newTopicSubmit(id) {
	var name = $("#popup_new_topic #new_topic_title").val();
	var id = userID;
	var intro = $("#popup_new_topic #new_topic_intro").val();
	var openess = $("#popup_new_topic #new_topic_openess").val();
	var category = $("#popup_new_topic #new_topic_category").val();
	if (openess == "公开")
		openess = "true";
	else
		openess = "false";
	$.ajax({
		type : "POST",
		url : "servlet/NewTopic",
		data : "id=" + id + "&name=" + name + "&intro=" + intro + "&openess="
				+ openess + "&category=" + category + "&groupid="
				+ currentGroup,
		success : function(msg) {
			if (msg != "error") {
				jNotify("success.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});

				var topic = eval("(" + msg + ")");
				var html = "<tr class='pl' id='topic-item-" + topic.id
						+ "'> <td><a href='page/topic.jsp?topicid=" + topic.id
						+ "' title='" + name + "'>" + name + "</a></td> <td>"
						+ topic.user + "</td> <td align='right'>"
						+ topic.replycount + "</td> </tr>";
				$("#topic-table-title").after(html);

			} else {
				jError("error.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
			}
		}
	});
	$("#popup_new_topic").fadeOut();
	return false;
}

/*
 * <div class="stream-manager" id="user-stream-manager"> <div class="stream"> <%
 * for(int i = 0 ; i < userlist.size() ; i ++) { User currentuser =
 * userlist.get(i); %> <div class='user-item' id="user-item-<%=currentuser.getUserid()
 * %>"> <div class="more"></div> <div class="message"> <div
 * class="message-image"> <img height="48" width="48"
 * src="http://a3.twimg.com/profile_images/1107286845/DW_speaking_normal.jpg">
 * </div> <div class="user-info-content"> <div class="user-info-row"> <span
 * class="user-name"> <a class="user-nickname" href="javascript:void(false)"><%=currentuser.getNickname() %></a>
 * <span class="user-realname"><%=currentuser.getRealname() %></span> </span>
 * </div> <div class="user-info-row"> <div class="email-info"> <span
 * style="font-size: 17px !important; font-weight: bold">Email:</span>
 * <%=currentuser.getEmail() %> </div> </div> <div class="user-info-row"> <div
 * class="user-intro"> <%=currentuser.getIntroduction() %> </div> </div> </div>
 * <div class="function-button-bar"> <a href="javascript:void(false)"
 * class="css3button" class="follow-button"><span class="check icon"></span>Follow</a>
 * <a href="javascript:void(false)" class="css3button"><span class="rss icon"></span>Subscribe
 * to RSS Feed</a> <a href="javascript:void(false)" class="css3button"><span
 * class="comment icon"></span>Add Comment</a> </div> </div> </div> <% } %>
 * </div> </div>
 * 
 * 
 * <div class="details-pane-outer" style="top: 65px;"> <div
 * class="details-pane-shell"> <div class="details-pane"> <div
 * class="inner-pane"> <div class="pane-toolbar" onclick="close_dashboard()"> <a
 * class="pane-close">close <span>×</span> </a> </div> <div
 * class="pane-components"> <div class="pane-components-inner"> <div
 * class="component"> <div class="topic"> <div class="topic-title"> Topic Title
 * </div> <div class="topic-info"> <a href="#">Owner</a> <div> June 16th </div>
 * </div> </div> </div> <div class="component"> <hr class="component-spacer">
 * </div> <div class="component"> <div class="reply-userfrom"> <a
 * class="reply-userfrom-username" data-user-id="228771545" href="/#!/Ruby_Tao"
 * title="Ruby">UserFrom</a> <span class="reply-userfrom-fullname">Fromer</span>
 * </div> </div> <div class="component"> <div class="reply-message"> <a
 * class="reply-userto-username" href=""> <span class="at">@<%=user.getNickname()%></span>
 * </a> <span class="reply-message-content">every time is your time</span> <div
 * class="reply-timestamp"> Jun 16th </div> <span class="reply-actions"> <a
 * class="favorite-action" title="Favorite" rel="favorite"><b>Favorite</b>
 * </a> <a class="reply-action" title="Reply" rel="reply"><b>Reply</b> </a> <a
 * class="delete-action" title="Delete" rel="delete"><b>Delete</b> </a>
 * </span> </div> </div> </div> </div> </div> </div> </div> </div>
 * 
 * 
 */

/*
 * <div class="feedlist" style="display : none"> <% for(int j = 0 ; j <
 * feedlist.size() ; j ++) { if(feedlist.get(j) instanceof Groups) { Groups
 * currentGroup = (Groups)feedlist.get(j); groupcount ++; %> <div
 * class="feedlist-groups"> <div class="feedlist-group">
 * <%=currentGroup.getName() %> </div> </div> <% } else{ Topic currentTopic =
 * (Topic)feedlist.get(j); topiccount++; %> <div class="feedlist-topics"> <div
 * class="feedlist-topic"> <%=currentTopic.getTitle() %> </div> </div> <% } } %>
 * <div class="group-count"> <%=groupcount %> </div> <div class="topic-count">
 * <%=topiccount %> </div> </div>
 */

function onUserItemClick(id) {

	var userid = id.slice(10);

	if (is_user_pane_out == true) {
		$("#user-pane-outer").fadeOut();
	}
	if (is_group_pane_out == true) {
		$("#group-pane-outer").fadeOut();
	}

	if (currentUser != userid)
		$("#user-item-" + currentUser + " .more")
				.css("background",
						" url('res/pic/home/sprite-icons.png') no-repeat scroll -288px 0 transparent");

	$("#user-pane-outer").fadeIn();

	$("#user-item-" + userid + " .more")
			.css("background",
					" url('res/pic/home/sprite-icons.png') no-repeat scroll -320px 0 transparent");

	currentUser = userid;

	$
			.ajax({
				type : "GET",
				url : "servlet/GetUserGroups",
				data : "id=" + userid + "&screen_user=" + userID,
				success : function(msg) {
					var groups = eval("(" + msg + ")");
					$("#user-pane-outer tbody").empty();
					$("#user-pane-outer tbody")
							.append(
									"<tr> <td> 小组 </td> <td> 作者 </td> <td> 关注人数 </td> <td align='right' nowrap='nowrap'> 关注 </td>");
					for ( var i = 0; i < groups.count; i++) {
						var group = groups.group[i];
						var f;
						if (group.follow == "yes")
							f = "已经关注";
						else
							f = "<a style='cursor : pointer' onclick='FollowGroup("
									+ group.id + ")'>关注</a>";
						var html = "<tr class='pl'> <td>" + group.name
								+ "</td> <td>" + group.owner
								+ "</td><td align='center'>"
								+ group.followercount
								+ "</td> <td align='right'>" + f
								+ "</td> </tr>";
						$("#user-pane-outer tbody").append(html);
					}
				}
			});
	is_user_pane_out = true;

	return false;
}

function onGroupItemClick(id) {
	var groupid = id.slice(11);
	if (is_group_pane_out == true) {
		$("#group-pane-outer").fadeOut();
	}

	if (is_user_pane_out == true) {
		$("#user-pane-outer").fadeOut();
	}

	if (currentGroup != groupid)
		$("#group-item-" + currentGroup + " .more")
				.css("background",
						" url('res/pic/home/sprite-icons.png') no-repeat scroll -288px 0 transparent");

	$("#group-pane-outer").fadeIn();

	$("#group-item-" + groupid + " .more")
			.css("background",
					" url('res/pic/home/sprite-icons.png') no-repeat scroll -320px 0 transparent");

	currentGroup = groupid;

	$
			.ajax({
				type : "GET",
				url : "servlet/GetGroupTopics",
				data : "id=" + userID + "&groupid=" + groupid,
				success : function(msg) {
					var topics = eval("(" + msg + ")");
					$("#group-pane-outer tbody").empty();
					$("#group-pane-outer tbody")
							.append(
									"<tr id='topic-table-title'> <td> 话题 </td> <td> 作者 </td> <td align='right' nowrap='nowrap'> 回应 </td> </tr>");
					for ( var i = 0; i < topics.count; i++) {
						var topic = topics.topic[i];
						var html = "<tr class='pl' id='topic-item-" + topic.id
								+ "'> <td><a href='page/topic.jsp?topicid="
								+ topic.id + "' title='" + topic.title + "'>"
								+ topic.title + "</a></td> <td>" + topic.user
								+ "</td> <td align='right'>" + topic.replycount
								+ "</td> </tr>";
						$("#group-pane-outer tbody").append(html);
					}
				}
			});
	is_group_pane_out = true;

	return false;

}

function onClickUnfollowGroup(id) {

	$.ajax({
		type : "POST",
		url : "servlet/UnfollowGroup",
		data : "id=" + userID + "&type=unfollow" + "&groupid=" + id,
		success : function(msg) {
			if (msg == "success") {
				jNotify("success.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
				$("#group-item-" + id).fadeOut();
			} else {
				jError("error.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
			}
		}
	});

	return false;
}

function onClickUnfollowUser(id) {
	$.ajax({
		type : "POST",
		url : "servlet/UnfollowUser",
		data : "id=" + userID + "&type=unfollow" + "&userid=" + id,
		success : function(msg) {
			if (msg == "success") {
				jNotify("success.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
				$("#user-item-" + id).fadeOut();
			} else {
				jError("error.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
			}
		}
	});
	return false;
}

function onClickNewTopic() {
	var popID = "popup_new_topic"; // Get
	// Popup
	// Name
	var popURL = "#?w=800"; // Get Popup
	var query = popURL.split('?');
	var dim = query[1].split('&');
	var popWidth = dim[0].split('=')[1]; // Gets
	// the
	// first
	// query
	// string value

	// Fade in the Popup and add close
	// button
	$('#' + popID)
			.fadeIn()
			.css({
				'width' : Number(popWidth) - 50
			})
			.prepend(
					'<a href="#" class="close"><img src="res/pic/home/close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>');

	// Define margin for center
	// alignment (vertical horizontal) -
	// we add 80px to the height/width
	// to accomodate for the padding and
	// border width defined in the css
	var popMargTop = ($('#' + popID).height() + 80) / 2;
	var popMargLeft = ($('#' + popID).width() + 80) / 2;

	// Apply Margin to Popup
	$('#' + popID).css({
		'margin-top' : -popMargTop,
		'margin-left' : -popMargLeft
	});

	$(".twitter-anywhere-tweet-box-editor")
			.val(
					"@"
							+ $("#" + id + " .message-name .message-nickname")
									.text() + " ");
	currentRemindId = $("#" + id).attr("remind-id");
	$("#reply-button").attr("remind-item-id", id);

	return false;
}

function close_dashboard() {
	$(".details-pane-outer").fadeOut();
	is_group_pane_out = false;
	is_user_pane_out = false;
	$("#group-item-" + currentGroup + " .more")
			.css("background",
					" url('res/pic/home/sprite-icons.png') no-repeat scroll -288px 0 transparent");
	$("#user-item-" + currentUser + " .more")
			.css("background",
					" url('res/pic/home/sprite-icons.png') no-repeat scroll -288px 0 transparent");
	return false;
}

/*
 * <div class="group-item" id="group-item-<%=group.getId()%>"
 * onmouseover="onItemMouseOver(id)" onmouseout="onItemMouseOut(id)"
 * onclick="onGroupItemClick(id)""> <div class="more"></div> <div
 * class="message"> <div class="group-info"> <div class="group-name">
 * <%=group.getName()%> </div> <div class="group-info-content"> <div
 * class="group-info-row"> <a class="group-owner"><%=group.getUser().getNickname()%></a>
 * </div> <div class="group-info-row"> <div class="tweet-timestamp" title="<%=group.getBuilddate()%>">
 * <span class="_old-timestamp"><%=group.getBuilddate()%></span> </div> </div>
 * <div class="group-info-row"> <div class="group-intro">
 * <%=group.getIntroduction()%> </div> </div> </div> </div> <div
 * class="function-button-bar"> <a href="javascript:void(false)"
 * class="css3button" onclick="onClickUnfollowGroup(<%=group.getId()%>)"><span
 * class="check icon"></span>Unfollow</a> <a href="javascript:void(false)"
 * class="css3button"><span class="rss icon"></span>Subscribe to RSS Feed</a>
 * <a href="javascript:void(false)" class="css3button"><span class="comment
 * icon"></span>Add Comment</a> </div> </div> </div>
 */

function getMoreGroup() {
	$
			.ajax({
				type : "GET",
				url : "servlet/GetMoreGroups",
				data : "id=" + userID,
				success : function(msg) {
					if (msg == "no more") {
						$("#get-more-group a").text("no more");
					} else {
						$("#group-item-more").remove();

						var groups = eval("(" + msg + ")");

						for ( var i = 0; i < groups.count; i++) {
							var group = groups.group[i];
							var html = "<div class='group-item' id='group-item-"
									+ group.id
									+ "' onmouseover='onItemMouseOver(id)' onmouseout='onItemMouseOut(id)' onclick='onGroupItemClick(id)' > <div class='more'></div> <div class='message'> <div class='group-info'> <div class='group-name'>"
									+ group.name
									+ "</div> <div class='group-info-content'> <div class='group-info-row'> <a class='group-owner'>"
									+ group.userNickname
									+ "</a> </div> <div class='group-info-row'> <div class='tweet-timestamp' title='"
									+ group.time
									+ "'> <span class='_old-timestamp'>"
									+ group.time
									+ "</span> </div> </div> <div class='group-info-row'> <div class='group-intro'>"
									+ group.intro
									+ "</div> </div> </div> </div> <div class='function-button-bar'> <a href='javascript:void(false)' class='css3button' onclick='onClickUnfollowGroup("
									+ group.id
									+ ")'><span class='check icon'></span>Unfollow</a> <a href='javascript:void(false)' class='css3button'><span class='rss icon'></span>Subscribe to RSS Feed</a></div> </div> </div>";

							$("#group-stream-manager .stream").append(html);
						}

						$("#group-stream-manager .stream")
								.append(
										"<div class='group-item' id='group-item-more'> <div class='get-more' id='get-more-group' onclick='getMoreGroup()'> <a>more</a> </div> </div>");

					}
				}
			});

	return false;
}

/*
 * <div class='user-item' id="user-item-<%=currentuser.getUserid()%>"
 * onmouseover="onItemMouseOver(id)" onmouseout="onItemMouseOut(id)"
 * onclick="onUserItemClick(id)"> <div class="more"></div> <div
 * class="message"> <div class="message-image"> <img height="48" width="48"
 * src="http://a3.twimg.com/profile_images/1107286845/DW_speaking_normal.jpg">
 * </div> <div class="user-info-content"> <div class="user-info-row"> <span
 * class="user-name"> <a class="user-nickname" href="javascript:void(false)"><%=currentuser.getNickname()%></a>
 * <span class="user-realname"><%=currentuser.getRealname()%></span> </span>
 * </div> <div class="user-info-row"> <div class="email-info"> <span
 * style="font-size: 17px !important; font-weight: bold">Email:</span>
 * <%=currentuser.getEmail()%> </div> </div> <div class="user-info-row"> <div
 * class="user-intro"> <%=currentuser.getIntroduction()%> </div> </div> </div></div>
 * 
 */

function getMoreUser() {
	$
			.ajax({
				type : "GET",
				url : "servlet/GetMoreUsers",
				data : "id=" + userID,
				success : function(msg) {
					if (msg == "no more") {
						$("#get-more-user a").text("no more");
					} else {
						$("#user-item-more").remove();

						var users = eval("(" + msg + ")");

						for ( var i = 0; i < groups.count; i++) {
							var user = users.user[i];
							var html = "<div class='user-item' id='user-item-"
									+ user.id
									+ "' onmouseover='onItemMouseOver(id)' onmouseout='onItemMouseOut(id)' onclick='onUserItemClick(id)' > <div class='more'></div> <div class='message'> <div class='message-image'> <img height='48' width='48' src='"
									+ user.picurl
									+ "'> </div> <div class='user-info-content'> <div class='user-info-row'> <span class='user-name'> <a class='user-nickname' href='javascript:void(false)'>"
									+ user.nickname
									+ "</a> <span class='user-realname'>"
									+ user.realname
									+ "</span> </span> </div> <div class='user-info-row'> <div class='email-info'> <span style='font-size: 17px !important; font-weight: bold'>Email:</span>"
									+ user.email
									+ "</div> </div> <div class='user-info-row'> <div class='user-intro'>"
									+ user.intro
									+ "</div> </div> </div></div>"
									+ "<div class='function-button-bar'> <a href='javascript:void(false)' class='css3button' onclick='onClickUnfollowUser("
									+ user.id
									+ ")'><span class='check icon'></span>Unfollow</a> <a href='javascript:void(false)' class='css3button'><span class='rss icon'></span>Subscribe to RSS Feed</a> <a href='javascript:void(false)' class='css3button' onclick='onClickSendMessage("
									+ user.id
									+ ")'><span class='comment icon'></span>Add Comment</a> </div>";

							$("#user-stream-manager .stream").append(html);
						}

						$("#user-stream-manager .stream")
								.append(
										"<div class='user-item' id='user-item-more'> <div class='get-more' id='get-more-user' onclick='getMoreUser()'> <a>more</a> </div> </div>");

					}
				}
			});

	return false;
}

function FollowGroup(id) {
	$.ajax({
		type : "POST",
		url : "servlet/UnfollowGroup",
		data : "id=" + userID + "&groupid=" + id + "&type=follow",
		success : function(msg) {
			if (msg != "error") {
				jNotify("success.", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
				$("#user-item-" + id).fadeOut();
			} else {
				jError("error", {
					HorizontalPosition : "center",
					VerticalPosition : "center"
				});
			}
		}
	});
}

function more_FollowGroup(id) {
	$
			.ajax({
				type : "POST",
				url : "servlet/UnfollowGroup",
				data : "id=" + userID + "&groupid=" + id + "&type=follow",
				success : function(msg) {
					if (msg != "error") {
						jNotify("success.", {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});

						var group = eval("(" + msg + ")");
						var html = "<div class='group-item' id='group-item-"
								+ group.id
								+ "' onmouseover='onItemMouseOver(id)' onmouseout='onItemMouseOut(id)' onclick='onGroupItemClick(id)' > <div class='more'></div> <div class='message'> <div class='group-info'> <div class='group-name'>"
								+ group.name
								+ "</div> <div class='group-info-content'> <div class='group-info-row'> <a class='group-owner'>"
								+ group.userNickname
								+ "</a> </div> <div class='group-info-row'> <div class='tweet-timestamp' title='"
								+ group.time
								+ "'> <span class='_old-timestamp'>"
								+ group.time
								+ "</span> </div> </div> <div class='group-info-row'> <div class='group-intro'>"
								+ group.intro
								+ "</div> </div> </div> </div> <div class='function-button-bar'> <a href='javascript:void(false)' class='css3button' onclick='onClickUnfollowGroup("
								+ group.id
								+ ")'><span class='check icon'></span>Unfollow</a> <a href='javascript:void(false)' class='css3button'><span class='rss icon'></span>Subscribe to RSS Feed</a></div> </div> </div>";

						$("#group-item-more").before(html);

						$("#more-group-" + id).fadeOut();
					} else {
						jError(msg, {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});
					}
				}
			});
}

function more_FollowUser(id) {

	$
			.ajax({
				type : "POST",
				url : "servlet/UnfollowUser",
				data : "id=" + userID + "&userid=" + id + "&type=follow",
				success : function(msg) {
					if (msg != "error") {
						jNotify("success.", {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});

						var user = eval("(" + msg + ")");
						var html = "<div class='user-item' id='user-item-"
								+ user.id
								+ "' onmouseover='onItemMouseOver(id)' onmouseout='onItemMouseOut(id)' onclick='onUserItemClick(id)' > <div class='more'></div> <div class='message'> <div class='message-image'> <img height='48' width='48' src='"
								+ user.picurl
								+ "'> </div> <div class='user-info-content'> <div class='user-info-row'> <span class='user-name'> <a class='user-nickname' href='javascript:void(false)'>"
								+ user.nickname
								+ "</a> <span class='user-realname'>"
								+ user.realname
								+ "</span> </span> </div> <div class='user-info-row'> <div class='email-info'> <span style='font-size: 17px !important; font-weight: bold'>Email:</span>"
								+ user.email
								+ "</div> </div> <div class='user-info-row'> <div class='user-intro'>"
								+ user.intro
								+ "</div> </div> </div></div>"
								+ "<div class='function-button-bar'> <a href='javascript:void(false)' class='css3button' onclick='onClickUnfollowUser("
								+ user.id
								+ ")'><span class='check icon'></span>Unfollow</a> <a href='javascript:void(false)' class='css3button'><span class='rss icon'></span>Subscribe to RSS Feed</a> <a href='javascript:void(false)' class='css3button' onclick='onClickSendMessage("
								+ user.id
								+ ")'><span class='comment icon'></span>Add Comment</a> </div>";
						$("#user-item-more").before(html);

						$("#more-user-" + id).fadeOut();
					} else {
						jError(msg, {
							HorizontalPosition : "center",
							VerticalPosition : "center"
						});
					}
				}
			});
}

function onClickSendMessage(id) {
	var popID = "popup_message"; // Get
	// Popup
	// Name
	var popURL = "#?w=500"; // Get Popup
	var query = popURL.split('?');
	var dim = query[1].split('&');
	var popWidth = dim[0].split('=')[1]; // Gets
	// the
	// first
	// query
	// string value

	// Fade in the Popup and add close
	// button
	$('#' + popID)
			.fadeIn()
			.css({
				'width' : Number(popWidth) - 50
			})
			.prepend(
					'<a href="#" class="close"><img src="res/pic/home/close_pop.png" class="btn_close" title="Close Window" alt="Close" /></a>');

	// Define margin for center
	// alignment (vertical horizontal) -
	// we add 80px to the height/width
	// to accomodate for the padding and
	// border width defined in the css
	var popMargTop = ($('#' + popID).height() + 80) / 2;
	var popMargLeft = ($('#' + popID).width() + 80) / 2;

	// Apply Margin to Popup
	$('#' + popID).css({
		'margin-top' : -popMargTop,
		'margin-left' : -popMargLeft
	});

	$("#message-button").attr("message-user-id", id);

	return false;
}
